<template>
	 <view class="pro-body">
	<view class="promenu-item">
	    <i />查询
	</view>
	<view class="uni-form-item uni-column">
	    <view class="search-box">
	        <input class="uni-input" confirm-type="search" placeholder="输入仓位"
			 v-model="header.locationNo"  />
	    </view>
		<view class="selectPanel_body">
		    <button @click="getInventory" class="seleBtn save" >
		        <i></i>查询
		    </button>
		</view>
	</view>
	<!-- <view class="wlmessage">
	   <uni-list :border="false" >
	
	   	<uni-list-item :border="false" title="物料编码:" :rightText="header.materialNo" />
	   	<uni-list-item :border="false" title="物料名称:"  :rightText="header.materialName" />
	   </uni-list>
	</view> -->
	<view class="procentainerlist">
		<uni-table ref="table" :loading="loading" border stripe  emptyText="暂无更多数据" >
						<uni-tr>
							<uni-th width="80px" align="center" background-color>
								<view class="location">件号</view>
								</uni-th>
							<uni-th width="80px" align="center">
								<view class="zmnumber">仓位</view>
							</uni-th>
							<uni-th width="80px" align="center">
								<view class="zmnumber">批号</view>
							</uni-th>
							<uni-th width="80px" align="center">
								<view class="pdnumber">库存数</view>
							</uni-th>
						</uni-tr>
						<uni-tr v-for="(item, index) in tableData" :key="index">
							<uni-td  align="center">
								<view class="location">{{ item.itemnumber }}</view>
							</uni-td>
							<uni-td align="center">
								<view class="zmnumber">{{ item.locationno }}</view>
							</uni-td>
							<uni-td align="center">
								<view class="zmnumber">{{ item.flot }}</view>
							</uni-td>
							<uni-td  align="center">
								<view class="pdnumber">{{ item.fqty }}</view>
							</uni-td>
						</uni-tr>
					</uni-table>
					
				</view>
					<!--  底部按钮 -->
				<!-- 	<view class="footerPanel">
						<view class="footerPanel_body">
							<button @click="goBack" class="footerBtn scan" type="primary"><i></i>返回
							</button>
						</view>
					</view> -->
	</view>
</template>

<script>
	import {
	getInventoryByMaterial} from '@/utils/api.js';
	export default {
	    data() {
	        return {
	            header: {
	                locationNo: '',
	                materialName: ''
	            },
				loading: false,
				tableData: []
	        };
	    },
		methods:{
			/**
			 * 根据物料编码查询库存
			 */
			getInventory(){
				getInventoryByMaterial({locationNo : this.header.locationNo}).then(res => {
					if(res.data.status == 200){
						if(res.data.data.dataList.length == 0){
							uni.showToast({
								title:'暂无信息',
								icon:'none'
							})
							return
						}
						this.tableData = res.data.data.dataList
						this.header.materialName =   res.data.data.dataList[0].materialName
					}
				
				})
			},
			initData (){
				
	
			},
		
			
			
		},
		mounted() {
			this.initData()
	
			
		},
	};
</script>

<style lang="scss" scoped>
	@import "../../static/css/common";
	/* #endif */
	.pro-body{
		background-color: #ffffff;
	}
	.promenu-item {
	         display: flex;
	         align-items: center;
	         justify-content: center;
	         height: 40px;
			 font-size: 26px; /* 增大字体大小 */
			 // font-weight: bold; /* 加粗字体 */
			 border-bottom: 2px solid #c1c1c1; /* 添加水平分割线 */
	    }
		.uni-form-item {
		  display: flex;
		  align-items: center;
		  margin-bottom: 10px;
		}
		
		.search-box {
			display: flex;
			width: 74%;
			align-items: center;
			border: 1px solid #ccc;
			margin-left:10px;
			margin-top:15px;
		
		}
		
		.uni-input {
			flex: 1;
			padding: 10px;
			border: none;
			outline: none;
		}
		.footerPanel_body {//提交按钮
			display: flex;
			align-items: center;
		}
		.seleBtn {
			
				margin-top:15px;
			    margin-left: 12px; /* 与输入框保持一定距离 */ 
				margin-right: 5px;
			    // padding: 3px 6px;
				height: 40px;
			
			    border: none;  
			    background-color: #1aad19;  
			    color: white;  
			    border-radius: 4px;  
			    cursor: pointer;  
				width: 70px;
				flex-shrink: 0; /* 防止按钮在宽度不足时被压缩到太小 */  
				  text-align: center; /* 水平居中 */
				  line-height: 35px; /* 垂直居中 */
			
		}
		
		
	
	.pdnumber {
		
		font-size: 18px;
		color: #000000;
	}
	.zmnumber {
		
		font-size: 18px;
		color: #000000;
	}
	.location {
		font-size: 18px;
		color: #000000;
	}
	
</style>
